<template>
 
    <div class="charts" ref="charts">
        
    </div>
</template>

<script >
import echarts from 'echarts'

export default {
    name: "",
    data() {
        return {}
    },
    mounted(){
        //初始化echarts实例
        let lineCharts = echarts.init(this.$refs.charts)
        //配置数据
        lineCharts.setOption({
             xAxis:{
                show:false,
                type:'category'
             } ,
             yAxis:{
                //隐藏
                show:false
             },
             //系列
             series:[
                {
                    type:"line",
                    data:[10,7,33,12,25],
                    //隐藏拐点
                    itemStyle:{
                        opacity:0
                    },
                    //线条颜色
                    lineStyle:{
                        color:'purple',
                       
                    },
                    //填充颜色
                    areaStyle:{
                        color:
                            {
                        type: 'linear',
                        x: 0,
                        y: 0,
                        x2: 0,
                        y2: 1,
                        colorStops: [{
                            offset: 0, color: 'purple' // 0% 处的颜色
                        }, {
                            offset: 1, color: 'white' // 100% 处的颜色
                        }],
                        global: false // 缺省为 false
                       }
                        
                    }
                }
             ],
             //布局
             grid:{
                left:0,
                right:0,
                top:0,
                bottom:0,
             }


        })
    },
    components: {},
    methods: {}
}
</script>

<style >
   .charts{
    widows: 100%;
    height: 100%;
   }
</style>
